<template>
  <div class="content">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane  label="课程管理" name="first">
        <class v-if="activeName === 'first'"></class>
      </el-tab-pane>
      <el-tab-pane label="考核规则" name="second">
        <rules v-if="activeName === 'second' "></rules>
      </el-tab-pane>
      <el-tab-pane label="章节管理" name="third">
        <chapter v-if="activeName === 'third' "></chapter>
      </el-tab-pane>
      <el-tab-pane label="资料管理" name="fourth">
        <datum v-if="activeName === 'fourth' "></datum>
      </el-tab-pane>
<!--      <el-tab-pane label="阶段/综合测评" name="stage">-->
<!--        <evaluation v-if="activeName === 'stage' "></evaluation>-->
<!--      </el-tab-pane>-->
    </el-tabs>
  </div>
</template>

<script>
import Class from './components/class/index.vue';
import rules from './components/rules/index.vue';
import chapter from './components/chapter/index.vue';
import datum from './components/datum/index.vue';
import evaluation from './components/evaluation/index.vue';

export default {
  components: {Class, rules, chapter, datum},
  data() {
    return {
      activeName: 'first'
    }
  },
  methods: {
    handleClick(tab, event) {
      // if(tab.index === '0'){
      //
      // }else if(tab.index === '1'){
      //
      // }else if(tab.index === '2'){
      //
      // }else if(tab.index === '3'){
      //
      // }else if(tab.index === '4'){
      //
      // }
    }
  },
  created() {

  }
}
</script>

<style scoped>
.content {
  padding: 0px 20px;
}
</style>
